import Head from 'next/head'
import Router from 'next/router'
import NProgress from 'nprogress'

NProgress.configure({ showSpinner: false })
Router.onRouteChangeStart = () => {
    NProgress.start()
}
Router.onRouteChangeComplete = () => NProgress.done()
Router.onRouteChangeError = () => NProgress.done()

export default ({ children }) =>
    <div className="AntdLayout">
        <Head>
            <meta name='viewport' content='width=device-width, initial-scale=1' />
            <meta charSet='utf-8' />
            <link rel='stylesheet' href='../static/antd.min.css' />
            <link rel='stylesheet' href='../static/progress.css' />
            <link rel='stylesheet' href='../static/const.css' />
        </Head>
        {children}
        <style jsx>{`
            :global(body >div:first-child) {
                height: 100%;
            }
            .AntdLayout {
                height: 100%;
            }
        `}</style>
    </div>